
.attn-content{
	width:960px;
	margin: 0 auto;
	.h-nav{
		font-size: 12px;
		color: #8d8d8d;
		margin-top: 23px;
		margin-bottom: 8px;
		font-family: SimSun;
		clear: both;
	}
}
.attn-side-nav{
	width: 170px;
	float: left;
	h3{
		background-color: #0697da;
		color:#fff;
		height: 45px;
		font-size: 16px;
		line-height: 45px;
		font-family: 'Microsoft YaHei';
		text-indent: 30px;
	}
}
.attn-content-right{
	width: 770px;
	float: right;
}
%back-img{
	background-image: url(../../images/attn-icons.png);
	background-repeat: no-repeat;
}
.attn-nav-item{
	font-family: SimSun;
	h4{
		width: 170px;
		height: 45px;
		background-color: #efefef;
		font-size: 16px;
		color: #646464;
		text-indent: 48px;
		line-height: 45px;
		font-family: 'Microsoft YaHei';
	}

	.side-user{
		@extend %back-img;
		background-position: 15px 0px;
	}
	.side-money{
		@extend %back-img;
		background-position: 15px -45px;
	}
	.side-tuo{
		@extend %back-img;
		background-position: 15px -90px;
	}
	.side-info{
		@extend %back-img;
		background-position: 15px -135px;
	}
	a{
		display: block;
		text-decoration: none;
		background-color: #fff;
		height: 35px;
		color: #8b8b8b;
		font-size: 12px;
		text-indent: 48px;
		line-height: 35px;
		&.active{
			background-color: #dcf5fd;
			border-left: 2px solid #27acd9;
			color: #0697da;
		}
	}
}
.attn-info{
	width: 748px;
	border:1px solid #e5e5e5;
	padding: 12px 10px;
	font-family: 'Microsoft YaHei';
	height: 157px;
	.portrait{
		float: left;
		width: 100px;
		height: 100px;
		border-radius: 50px;
		margin-right: 16px;
	}
	.user-info{
		float: left;
		width:140px;
		border-right: 1px solid #e5e5e5;
		.hi{
			font-size: 18px;
			color: #666666;
			line-height: 40px;
			
		}
		.phone{
			color: #0ea2e6;
			font-size: 18px;
			line-height: 45px;
			font-weight: bold;
		}
		.grade{
			color: #666666;
			font-size: 14px;
			line-height: 20px;
			span{
				display: inline-block;
				color:#fff;
				background-color: #ecdf13;
				width: 20px;
				height: 20px;
				text-align: center;
				
			}
		}
		.icon{
			margin-top: 20px;
			a{
				width: 30px;
				height: 30px;
				display: inline-block;
				background-color: #4bc1e9;
				border-radius: 50%;
				margin-right: 5px;
				cursor: pointer;
				&:hover{
					background-color: #cacaca;
				}
			}
		}
		
	}
	.accout-info{
		padding-left: 28px;
		float:left;
		.cosh-title{
			font: 400 16px 'Microsoft YaHei';
			line-height: 36px;
			color: #666666;
			padding-left: 10px;
		}
		.cash-total{
			font-family: SimSun;
			border-bottom:1px solid #e5e5e5;
			padding-left: 10px;
			padding-bottom: 10px;
			span{
				color: #9c9c9c;
				font-size: 14px;
				display: inline-block;
				margin-right: 5px;
				em{
					font-size: 24px;
					color: #414141;
					font-family: 'Microsoft YaHei';
				}
				
			}
			.btn{
					width: 70px;
					display: inline-block;
					margin-right: 5px;
					height: 30px;
					line-height: 30px;
					text-align: center;
					border-radius: 4px;
					color: #ffffff;
					font-size: 14px;
				}
				.btn-co{
					background-color: #00a0e9;
					margin-left: 20px;
				}
				.btn-ti{
					background-color: #ecb611;
				}
		}
		.cash-info{
			display:inline-block;
			padding-left: 10px;
			width: 200px;
			margin-top: 12px;
			margin-right: 15px;
			h5{
				color: #9c9c9c;
				font: 400 14px SimSun;
				line-height: 20px;
			}
			p{
				color: #1e97eb;
				font: 400 24px 'Microsoft YaHei';
			}
			a{
				color: #27acd9;
				font: 400 12px SimSun;
				display: inline-block;
				width: 200px;
				text-align: right;
			}
		}
	}
	
}
.attn-notice{
		width: 768px;
		border:1px solid #e5e5e5;
		height: 40px;
		margin: 10px 0;
		overflow: hidden;
		span,a{
			line-height: 40px;
			margin-right: 20px;
			display: inline-block;
		}
		.new-notice{
			@extend %back-img;
			background-position: -26px -186px;
			color: #595757;
			padding-left: 30px;
			font: 400 14px 'Microsoft YaHei';
			
		}
		.notice{
			color: #595757;
			font: 400 14px SimSun;
		}
		.time-notime{
			font-size: 12px;
			color:#ccc;
			margin-left: 10px;
		}
		.more{
			color: #595757;
			font-size: 14px;
			float: right;
			
		}
	}
.attr-statistics{
	li{
		width: 253px;
		height: 100px;
		background-color: #eeeeee;
		float: left;
		margin-left: 3px;
	}
	i{
		width: 60px;
		height: 60px;
		color: #ffffff;
		font: 700 36px 'Microsoft YaHei';
		line-height: 60px;
		text-align: center;
		display: inline-block;
	}
	em{
		display: inline-block;
		color: #393939;
		font-family: 'Microsoft YaHei';
		line-height: 60px;
		font-size: 24px;
		margin-left: 10px;
		sub{
			color: #747474;
			font: 400 12px 'Microsoft YaHei';
			line-height: 40px;
			position: relative;
			bottom: 0px;
		}
	}
	.z{
		@extend %back-img;
		background-position: 150px -270px
	}
	.l{
		@extend %back-img;
		background-position: 150px -370px
	}
	.d{
		@extend %back-img;
		background-position: 150px -470px
	}
	.z i{
		background-color: #d46b68;
	}
	.l i{
		background-color: #569abd;
	}
	.d i{
		background-color: #78b188;
	}
	span{
		margin-top: 5px;
		display: block;
		width: 60px;
		color: #9a9a9a;
		font: 400 12px SimSun;
		text-align: center;
	}
}
.attr-table-info{
	h5{
		height: 43px;
		line-height: 43px;
		font-size: 14px;
		font-family: SimSun;
		color: #148fe5;
		span{
			float:right;
		}
	}
	table{
		width: 770px;
		border:1px solid #e5e5e5;
	}
	th{
		height: 40px;
		background-color: #66aadf;
		text-align: center;
		color:#fff;
		border-right: 1px solid #fff;
	}
	td{
		height: 40px;
		text-align: center;
		font-family: SimSun;
	}
}
.no-table-border table{
	border:0 solid #ccc;
}
.icon-user{
	@extend %back-img;
	background-position: 0 -180px;
}
.icon-email{
	@extend %back-img;
	background-position: 0 -210px;
}
.icon-phone{
	@extend %back-img;
	background-position: 0 -240px;
}








